<!-- 资讯服务 -->
<template>
  <div class="horizontal-tab">

    <div class="breadcrumb"  v-if="this.$route.query.title !== ''">
      您当前的位置：
      <span>资讯服务 > </span>&nbsp;
      <span style="color:#39ADFF;cursor:default"  @click="topreviousPath">{{this.$route.query.title}}</span>&nbsp;>&nbsp;
      <span>详情</span>
    </div>

    <div class="horizontal-span-con">
      <p>{{this.$route.query.title}}</p>
      <p v-html="contentDataCon"></p>
    </div>

  </div>
</template>

<script>

export default {
  name: 'Consultation_WeChatNews',
  data () {
    return {
      contentDataCon: ''
    }
  },
  components: {},
  computed: {},
  created () {
    this._getContentDesc()
  },
  mounted () {},
  methods: {
    topreviousPath () {
      this.$router.go(-1)
    },
    _getContentDesc () {
      this.$http.post('/v1/getMaterial', {
        mediaId: this.$route.query.id
      }).then(res => {
        const htmlStr = res.news_item[0].content
        const el = document.createElement('div')
        el.innerHTML = htmlStr
        const imgEls = el.getElementsByTagName('img')
        for (let i = 0; i < imgEls.length; i++) {
          const element = imgEls[i]
          if (element.getAttribute('src') == null || element.getAttribute('src') === '') {
            element.setAttribute('src', element.dataset.src)
          }
        }
        this.contentDataCon = el.innerHTML
      })
    }
  }
}

</script>

<style lang='stylus' rel='stylesheet/stylus' scoped>
.breadcrumb {
  padding 20px 0 20px 15%
  display flex
  align-items center
  margin-bottom 20px
  box-shadow 0 0 10px 2px #ddd
}

.horizontal-span-con {
  width 70%
  margin 0 auto
  p {
    font-size 24px
    font-weight bold
    margin 10px 0 20px
  }
}

</style>
